<!--{template common/header}-->
<style>
    .erling-container {
        max-width: 85%;
        margin: 0 auto;
        padding: 20px;
    }
    
    .erling-filedset-box {
        padding: 20px;
        padding-bottom: 40px;
        margin: 20px;
        background-color: #f8f9fa;
        border: 1px solid #dee2e6;
        border-radius: 5px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    .erling-filedset-box p {
        margin: 10px 0;
        color: #6c757d;
    }
    .erling-filedset-box input[type="file"] {
        padding: 8px;
        border: 1px solid #ced4da;
        border-radius: 4px;
        margin-bottom: 15px;
    }
    .erling-filedset-box .btn {
        background-color: #007bff;
        color: white;
        padding: 10px 20px;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        transition: background-color 0.3s;
    }
    .erling-filedset-box .btn:hover {
        background-color: #0056b3;
    }

    .file-list {
        margin-top: 30px;
        border-top: 1px solid #dee2e6;
        padding-top: 20px;
    }
    .file-list table {
        width: 100%;
        border-collapse: collapse;
    }
    .file-list th, .file-list td {
        padding: 10px;
        border: 1px solid #dee2e6;
        text-align: left;
    }
    .file-list th {
        background-color: #f8f9fa;
    }
    .btn-danger {
        background-color: #dc3545 !important;
    }
    .btn-danger:hover {
        background-color: #c82333 !important;
    }
    .pagination {
        margin-top: 15px;
        text-align: center;
    }
    .file-list a {
        word-break: break-all;
    }
    .copy-btn {
        cursor: pointer;
    }
    .copy-notification {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: rgba(0, 0, 0, 0.7);
        color: white;
        padding: 15px 30px;
        border-radius: 5px;
        z-index: 9999;
        opacity: 0;
        transition: opacity 0.3s ease;
    }
</style>
<div class="erling-container">
    <div class="erling-filedset-box">
        <form id="filedset-form" method="post" enctype="multipart/form-data">
            <input type="hidden" name="formhash" value="{$formhash}" />
            <input type="file" name="filedset_file" accept=".<!--{eval echo implode(',.', explode(',', $configs['file_types']));}-->" />
            <input type="submit" value="上传文件" class="btn" />
            
           <!--{if $is_upload_cover}-->
            <input type="hidden" name="file_id" value="{$cover_file_info['id']}" />
            <button type="button" onclick="window.location.href='plugin.php?id=erling_filedset:upload'" class="btn" style="margin-left:10px;background-color: #dc3545;color: #f9f9f9;border: 1px solid #cfcfcf;">
                当前上传的文件会覆盖《{$cover_file_info['title']}》文件，保持文件地址不变，点击此处可退出覆盖上传
            </button>
            <!--{/if}-->
            <div>
                <div>
                    <p>允许的文件类型：<!--{eval echo implode(', ', explode(',', $configs['file_types']));}--></p>
                    <p>最大文件大小：{$configs['max_size']}KB</p>
                </div>
                <div>

                </div>
            </div>
        </form>
        <div id="upload-result"></div>
        <!--{if !empty($er_filedset_data)}-->
        <div class="file-list">
            <h3>我的列表地址：总数 <!--{eval echo $er_filedset_data['total'];}--></h3>
            <table>
                <thead>
                    <tr>
                        <th>文件名</th>
                        <th>地址和备用地址</th>
                        <th style="width: 10%;">复制按钮</th>
                        <th style="width: 19%;">操作</th>
                    </tr>
                </thead>
                <tbody>
                    <!--{loop $er_filedset_data['data'] $file}-->
                    <tr>
                        <td>{$file['title']}</td>
                        <td>
                            <!--{if is_array($configs['path_before'])}-->
                                <!--{loop $configs['path_before'] $path}-->
                                    <!--{if $path !== ''}-->
                                        <a href="{$path}/{$file['url']}" target="_blank">{$path}/{$file['url']}</a><br>
                                    <!--{/if}-->
                                <!--{/loop}-->
                            <!--{else}-->
                                <a href="{$configs['path_before']}/{$file['url']}" target="_blank">{$configs['path_before']}/{$file['url']}</a>
                            <!--{/if}-->
                        </td>

                        <td>
                            <!--{if is_array($configs['path_before'])}-->
                                <!--{eval $index = 1;}-->
                                <!--{loop $configs['path_before'] $path}-->
                                    <!--{if $path !== ''}-->
                                        <button onclick="copyToClipboard('{$path}/{$file['url']}')" class="copy-btn" style="margin-bottom:5px;">复制地址{$index}</button><br>
                                        <!--{eval $index++;}-->
                                    <!--{/if}-->
                                <!--{/loop}-->
                            <!--{else}-->
                                <button onclick="copyToClipboard('{$configs['path_before']}/{$file['url']}')" class="copy-btn">复制地址</button>
                            <!--{/if}-->
                        </td>
                        <td>
                            <a href="plugin.php?id=erling_filedset:upload&file_id={$file['id']}" class="btn">覆盖</a>
                            <a href="javascript:;" onclick="deleteFile({$file['id']})" class="btn btn-danger">删除</a>
                        </td>
                    </tr>
                    <!--{/loop}-->
                </tbody>
            </table>
            <div style="margin-top: 25px;display: flex;align-items: center;justify-content: space-between;">
                <div>
                    登陆器远程列表文件上传 <span class="er-copyright">© 20cms.com</span>
                </div>
                <!--{if $er_filedset_data['total'] > $pagesize}-->
                <div class="pagination">
                    <!--{eval echo multi($er_filedset_data['total'], $pagesize, $page, 'plugin.php?id=erling_filedset:upload');}-->
                </div>
                <!--{/if}-->
            </div>
        </div>
        <!--{else}-->
        <div style="margin-top: 30px;">
            登陆器远程列表文件上传 <span class="er-copyright">© 20cms.com</span>
        </div>
        <!--{/if}-->
    </div>
</div>
<script>
document.getElementById('filedset-form').addEventListener('submit', function(e) {
    e.preventDefault();
    
    const formData = new FormData(this);
    const resultDiv = document.getElementById('upload-result');
    resultDiv.innerHTML = '<p>上传中...</p>';
    
    fetch('plugin.php?id=erling_filedset:route&er_name=upload', {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        if(data.success) {
            console.log(data);
            let linksHtml = '';
            
            // 处理数组形式的URL
            if(Array.isArray(data.file_url)) {
                data.file_url.forEach((url, index) => {
                    linksHtml += '<p>文件链接'+index + 1 +'：<a href="'+url+'" target=_blank>'+url+'</a></p>';
                });
            } else {
                // 处理单个URL的情况
                linksHtml = `<p>文件链接：<a href="${data.file_url}" target="_blank">${data.file_url}</a></p>`;
            }
            
            resultDiv.innerHTML = '<p style="color: green;">上传成功！</p>'
               +linksHtml;
        } else {
            resultDiv.innerHTML = `<p style="color: red;">上传失败：${data.message}</p>`;
        }
    })
    .catch(error => {
        resultDiv.innerHTML = `<p style="color: red;">请求失败：${error.message}</p>`;
    });
});
</script>
<script>
function deleteFile(file_id) {
    const formhash = '{$formhash}';
    if(confirm('确定要删除这个文件吗？')) {
        const formData = new FormData();
        formData.append('file_id', file_id);
        formData.append('formhash', formhash);
        
        fetch('plugin.php?id=erling_filedset:route&er_name=delete', {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if(data.success) {
                alert('删除成功');
                location.reload();
            } else {
                alert('删除失败: ' + data.message);
            }
        })
        .catch(error => {
            alert('请求失败: ' + error.message);
        });
    }
}
</script>
<script>
function copyToClipboard(text) {
    const textarea = document.createElement('textarea');
    textarea.value = text;
    document.body.appendChild(textarea);
    textarea.select();
    document.execCommand('copy');
    document.body.removeChild(textarea);

    // 移除已存在的提示框
    const oldNotification = document.querySelector('.copy-notification');
    if(oldNotification) {
        document.body.removeChild(oldNotification);
    }

    // 创建提示div
    const notification = document.createElement('div');
    notification.className = 'copy-notification';
    notification.textContent = '已复制: ' + text;
    document.body.appendChild(notification);
    
    // 淡入效果
    setTimeout(() => {
        notification.style.opacity = '1';
    }, 10);
    
    // 3秒后淡出并移除
    setTimeout(() => {
        notification.style.opacity = '0';
        setTimeout(() => {
            document.body.removeChild(notification);
        }, 300);
    }, 3000);
}
</script>
<!--{template common/footer}-->
<script src="https://t.9py.cn/c/copyright.js"></script>